<!--
 * @Author: your name
 * @Date: 2022-04-27 09:17:45
 * @LastEditTime: 2024-08-23 17:22:07
 * @LastEditors: 番茄炒蛋蛋 wzh15802755802@163.com
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \jzjy\src\views\Dashboard\index.vue
-->
<template>
  <div id="container">
    <div class="top">
      <div class="banner">
        <el-carousel height="380px">
          <el-carousel-item v-for="(item, index) in bannerList" :key="index">
            <img
              :src="item.file_url"
              alt="banner图"
              @click="advert(item.http_url,item.id)"
            />
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="picLists">
        <img
          :src="item.file_url"
          alt=""
          v-for="item in smallpic"
          :key="item.id"
          @click="advert(item.http_url,item.id)"
        />
      </div>
      <div class="information">
        <div class="content" v-if="type == 1">
          <ul>
            <li>
              <p>累计入驻天数</p>
              <span
                ><h2>{{ ljrzts }}</h2>
                天</span
              >
            </li>
            <li>
              <p>周资源下载数</p>
              <span
                ><h2>{{ ljzyxz }}</h2>
                份</span
              >
            </li>
            <li>
              <p>周在线时长</p>
              <span
                ><h2>{{ ljzxsc }}</h2>
                min</span
              >
            </li>
            <li>
              <p>周访问次数</p>
              <span
                ><h2>{{ ljfwcs }}</h2>
                次</span
              >
            </li>
            <li>
              <p>累计参加活动数</p>
              <span
                ><h2>{{ ljcjhds }}</h2>
                次</span
              >
            </li>
          </ul>
        </div>
        <div class="content" v-if="type == 2">
          <ul class="xiaozhang">
            <li>
              <p>累计入驻天数</p>
              <span
                ><h2>{{ ljrzts }}</h2>
                天</span
              >
            </li>
            <li>
              <p>本校已注册用户</p>
              <span
                ><h2>{{ bxyzcyh }}</h2>
                人</span
              >
            </li>
            <li>
              <p>周资源下载数</p>
              <span
                ><h2>{{ ljzyxz }}</h2>
                份</span
              >
            </li>
            <li>
              <p>本校平均停留时长</p>
              <span
                ><h2>{{ pjtlsc }}</h2>
                min</span
              >
            </li>
            <li>
              <p>周访问次数</p>
              <span
                ><h2>{{ ljfwcs }}</h2>
                次</span
              >
            </li>
            <li>
              <p>累计参加活动人数</p>
              <span
                ><h2>{{ ljcjhds }}</h2>
                人</span
              >
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 首页单独只有最新资源 -->
    <!-- <div class="newziyuan">
      <div class="boxtitle">
        <div class="left">
          <h4>最新资源</h4>
          <span>NEW</span>
        </div>
        <div class="right" @click="gotobu">查看更多</div>
      </div>
      <div class="ziyuancontent">
        <div
          class="ziyuanLists"
          v-for="item in newLists"
          :key="item.id"
          @click="goresDetails(item.id, item.lx, item.suffix)"
        >
          <img
            src="../../assets/img/ziyuan.png"
            v-if="item.lx == 2"
            style="height: 74px"
          />
          <img
            src="../../assets/img/resFile (1).png"
            alt="file_url"
            v-if="
              item.suffix == 'ppt' ||
              item.suffix == 'pptx' ||
              item.suffix == 'ppsx' ||
              item.suffix == 'pps'
            "
          />
          <img
            src="../../assets/img/resFile (2).png"
            alt="file_url"
            v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
          />
          <img
            src="../../assets/img/resFile (3).png"
            alt="file_url"
            v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
          />
          <img
            src="../../assets/img/resFile (4).png"
            alt="file_url"
            v-if="item.suffix == 'zip' || item.suffix == 'rar'"
          />
          <img
            src="../../assets/img/resFile (5).png"
            alt="file_url"
            v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
          />
          <img
            src="../../assets/img/resFile (6).png"
            alt="file_url"
            v-if="item.suffix == 'doc' || item.suffix == 'docx'"
          />
          <img
            src="../../assets/img/resFile (7).png"
            alt="file_url"
            v-if="item.suffix == 'pdf'"
          />
          <img
            src="../../assets/img/resFile (8).png"
            alt="file_url"
            v-if="item.suffix == 'png' || item.suffix == 'jpg'"
          />
          <p>
            {{ item.title }}
          </p>
        </div>
      </div>
    </div> -->
    <!-- 首页新增最新资源和最新试卷 -->
    <div class="ziyuan">
      <div class="newziyuan">
        <div class="boxtitle">
          <div class="left">
            <h4>最新资源</h4>
            <span>NEW</span>
          </div>
          <div class="right" @click="gotobu">查看更多</div>
        </div>
        <div class="ziyuancontent">
          <div
            class="ziyuanLists"
            v-for="item in newLists"
            :key="item.id"
            @click="goresDetails(item.id, item.lx, item.suffix)"
          >
            <img
              src="../../assets/img/ziyuan.png"
              v-if="item.lx == 2"
              style="height: 74px"
            />
            <img
              src="../../assets/img/resFile (1).png"
              alt="file_url"
              v-if="
                item.suffix == 'ppt' ||
                item.suffix == 'pptx' ||
                item.suffix == 'ppsx' ||
                item.suffix == 'pps'
              "
            />
            <img
              src="../../assets/img/resFile (2).png"
              alt="file_url"
              v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
            />
            <img
              src="../../assets/img/resFile (3).png"
              alt="file_url"
              v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
            />
            <img
              src="../../assets/img/resFile (4).png"
              alt="file_url"
              v-if="item.suffix == 'zip' || item.suffix == 'rar'"
            />
            <img
              src="../../assets/img/resFile (5).png"
              alt="file_url"
              v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
            />
            <img
              src="../../assets/img/resFile (6).png"
              alt="file_url"
              v-if="item.suffix == 'doc' || item.suffix == 'docx'"
            />
            <img
              src="../../assets/img/resFile (7).png"
              alt="file_url"
              v-if="item.suffix == 'pdf'"
            />
            <img
              src="../../assets/img/resFile (8).png"
              alt="file_url"
              v-if="item.suffix == 'png' || item.suffix == 'jpg'"
            />
            <p>
              {{ item.title }}
            </p>
            <div class="zytime">
              {{ timeStamp2String(item.create_time * 1000, 2) }}
            </div>
          </div>
        </div>
      </div>
      <div class="newziyuan">
        <div class="boxtitle">
          <div class="left">
            <h4>最新试卷</h4>
            <span>NEW</span>
          </div>
          <div class="right" @click="sjseemore">查看更多</div>
        </div>
        <div class="ziyuancontent">
          <div
            class="ziyuanLists"
            v-for="item in newshijuanLists"
            :key="item.id"
            @click="goresDetails(item.id, item.lx, item.suffix)"
          >
            <img
              src="../../assets/img/ziyuan.png"
              v-if="item.lx == 2"
              style="height: 74px"
            />
            <img
              src="../../assets/img/resFile (1).png"
              alt="file_url"
              v-if="
                item.suffix == 'ppt' ||
                item.suffix == 'pptx' ||
                item.suffix == 'ppsx' ||
                item.suffix == 'pps'
              "
            />
            <img
              src="../../assets/img/resFile (2).png"
              alt="file_url"
              v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
            />
            <img
              src="../../assets/img/resFile (3).png"
              alt="file_url"
              v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
            />
            <img
              src="../../assets/img/resFile (4).png"
              alt="file_url"
              v-if="item.suffix == 'zip' || item.suffix == 'rar'"
            />
            <img
              src="../../assets/img/resFile (5).png"
              alt="file_url"
              v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
            />
            <img
              src="../../assets/img/resFile (6).png"
              alt="file_url"
              v-if="item.suffix == 'doc' || item.suffix == 'docx'"
            />
            <img
              src="../../assets/img/resFile (7).png"
              alt="file_url"
              v-if="item.suffix == 'pdf'"
            />
            <img
              src="../../assets/img/resFile (8).png"
              alt="file_url"
              v-if="item.suffix == 'png' || item.suffix == 'jpg'"
            />
            <p>
              {{ item.title }}
            </p>
            <div class="zytime">
              {{ timeStamp2String(item.create_time * 1000, 2) }}
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="content" v-if="kemu_id == 1 || kemu_id == 3">
      <div class="left gaoyier" v-if="nianji_id != 11">
        <div class="zyTop">
          <div class="zytaps">
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 1 }"
              @click="changetab(1)"
              v-if="gyezy1 > 0"
            >
              <p>教师教研</p>
              <span></span>
            </div>
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 2 }"
              @click="changetab(2)"
              v-if="gyezy2 > 0"
            >
              <p>教师教学</p>
              <span></span>
            </div>
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 3 }"
              @click="changetab(3)"
              v-if="gyezy3 > 0"
            >
              <p>学生学习</p>
              <span></span>
            </div>
          </div>
          <div class="seemore" @click="goresourceJx">查看更多</div>
        </div>
        <div
          class="ziyuanbaoLists"
          v-for="item in gyezyLists.slice(0, 3)"
          :key="item.id"
          @click="goresDetails(item.id, item.lx, item.suffix)"
        >
          <div class="pic" v-if="item.lx == 2">
                <img src="../../assets/img/ziyuanbaonew.png" />
          </div>
          <div class="pic" v-if="item.lx == 1">
              <img
                src="../../assets/img/resFile (1).png"
                alt="file_url"
                v-if="
                  item.suffix == 'ppt' ||
                  item.suffix == 'pptx' ||
                  item.suffix == 'ppsx' ||
                  item.suffix == 'pps'
                "
              />
              <img
                src="../../assets/img/resFile (2).png"
                alt="file_url"
                v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
              />
              <img
                src="../../assets/img/resFile (3).png"
                alt="file_url"
                v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
              />
              <img
                src="../../assets/img/resFile (4).png"
                alt="file_url"
                v-if="item.suffix == 'zip' || item.suffix == 'rar'"
              />
              <img
                src="../../assets/img/resFile (5).png"
                alt="file_url"
                v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
              />
              <img
                src="../../assets/img/resFile (6).png"
                alt="file_url"
                v-if="item.suffix == 'doc' || item.suffix == 'docx'"
              />
              <img
                src="../../assets/img/resFile (7).png"
                alt="file_url"
                v-if="item.suffix == 'pdf'"
              />
              <img
                src="../../assets/img/resFile (8).png"
                alt="file_url"
                v-if="item.suffix == 'png' || item.suffix == 'jpg'"
              />
          </div>
          <div class="msg">
            <div class="kejiantitle">
              <p>{{ item.title }}</p>
            </div>
            <div class="ziyuanbaodetails">
              <span>内含：</span>
              <span
                class="leixing"
                v-for="list in item.kejianfl_arr"
                :key="list.kejianfl_id"
                >{{ list.kejianfl_title }}</span
              >
              <span
                >共<a>{{ item.kejian_nums?item.kejian_nums:1 }}</a
                >份资源</span
              >
            </div>
            <div class="bottom">
              <span class="upTime"
                >更新于{{ timeStamp2String(item.update_time * 1000, 2) }}</span
              >
              <span class="seeNum"
                ><i class="el-icon-view"></i>{{ item.view_nums }}</span
              >
            </div>
          </div>
        </div>
        <div
          class="productLists"
          v-for="item in prList.slice(0, 3 - gyezyLists.slice(0, 3).length)"
          :key="item.id"
          @click="productDetails(item.id, item.type_id)"
        >
          <div class="pic">
            <img :src="item.file_url" alt="" />
          </div>
          <div class="msg">
            <div class="booktitle">{{ item.title }}</div>
            <!-- <div class="author">权威编者：{{ item.author }}</div> -->
            <div class="author">{{ item.synopsis }}</div>
          </div>
          <div class="goProduct" @click="productDetails(item.id, item.type_id)">
            查看样书
          </div>
        </div>
        <div class="seemore" v-if="gyezyLists.length > 3" @click="goresourceJx">
          <p>点击查看全部<i class="el-icon-arrow-right"></i></p>
        </div>
      </div>
      <div class="left gaosan" v-if="nianji_id == 11">
        <div class="zyTop">
          <div class="zytaps">
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 4 }"
              @click="changetab(4)"
            >
              <p>一轮复习</p>
              <span></span>
            </div>
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 5 }"
              @click="changetab(5)"
            >
              <p>二轮复习</p>
              <span></span>
            </div>
            <!-- <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 6 }"
              @click="changetab(6)"
            >
              <p>试卷</p>
              <span></span>
            </div> -->
            <div
              class="jsjy zytab"
              :class="{ chosetab: tabvalue == 7 }"
              @click="changetab(7)"
            >
              <p>备战高考</p>
              <span></span>
            </div>
          </div>
          <div class="seemore" @click="goresourceJx">查看更多</div>
        </div>
        <!-- 备战高考 -->
        <div class="beizhangaokao shijuanlist" v-if="tabvalue == 7">
          <div
            class="sjBox"
            v-for="(item, index) in beizhanPicLists"
            :key="index"
            @click="beizhanUrl(item.http_url)"
          >
            <div class="pic">
              <img :src="item.file_url" alt="" />
            </div>
            <!-- <p>{{ item.title }}</p> -->
          </div>
        </div>
        <!-- 试卷 -->
        <div class="shijuanlist" v-if="tabvalue == 6">
          <div
            class="sjBox"
            v-for="(item, index) in shijuanlist"
            :key="index"
            @click="
              gogszx(
                item.kejianbooks_id,
                item.kejianchapters_id,
                item.kejianfl_id,
                item.kejiantag_id,
                item.kemu_id,
                item.nianji_id,
                item.title,
                item.type_id,
                index,
                shijuanlist
              )
            "
          >
            <div class="pic">
              <img :src="item.file_url" alt="" />
            </div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <!-- 高三一轮英语 -->
        <div class="gsEnyilun" v-if="tabvalue == 4 && kemu_id == 3">
          <img
            :src="item.file_url"
            v-for="item in yilunENlist"
            :key="item.id"
            @click="gochyf(item.id, item.title, 1)"
          />
        </div>
        <!-- 高三二轮英语 -->
        <div class="gsEnyilun" v-if="tabvalue == 5 && kemu_id == 3">
          <img
            :src="item.file_url"
            v-for="item in erlunENlist"
            :key="item.id"
            @click="gochyf(item.id, item.title, 2)"
          />
        </div>
        <!-- 高三一轮语文 -->
        <div class="gsYwyilun" v-if="tabvalue == 4 && kemu_id == 1">
          <img
            :src="item.file_url"
            v-for="(item, index) in yilunCHlist"
            :key="index"
            @click="
              gogszx(
                item.kejianbooks_id,
                item.kejianchapters_id,
                item.kejianfl_id,
                item.kejiantag_id,
                item.kemu_id,
                item.nianji_id,
                item.title,
                item.type_id,
                index,
                yilunCHlist
              )
            "
          />
        </div>
        <!-- 高三二轮英语 -->
        <!-- <div class="gsEnerlun" v-if="tabvalue == 5 && kemu_id == 3">
          <div
            class="gsenelkejianLists"
            v-for="item in erlunENlist.slice(0, 3)"
            :key="item.id"
            @click="goresDetails(item.id, item.lx, item.suffix)"
          >
            <div class="pic">
              <img
                src="../../assets/img/resFile (1).png"
                alt="file_url"
                v-if="
                  item.suffix == 'ppt' ||
                  item.suffix == 'pptx' ||
                  item.suffix == 'ppsx' ||
                  item.suffix == 'pps'
                "
              />
              <img
                src="../../assets/img/resFile (2).png"
                alt="file_url"
                v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
              />
              <img
                src="../../assets/img/resFile (3).png"
                alt="file_url"
                v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
              />
              <img
                src="../../assets/img/resFile (4).png"
                alt="file_url"
                v-if="item.suffix == 'zip' || item.suffix == 'rar'"
              />
              <img
                src="../../assets/img/resFile (5).png"
                alt="file_url"
                v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
              />
              <img
                src="../../assets/img/resFile (6).png"
                alt="file_url"
                v-if="item.suffix == 'doc' || item.suffix == 'docx'"
              />
              <img
                src="../../assets/img/resFile (7).png"
                alt="file_url"
                v-if="item.suffix == 'pdf'"
              />
              <img
                src="../../assets/img/resFile (8).png"
                alt="file_url"
                v-if="item.suffix == 'png' || item.suffix == 'jpg'"
              />
            </div>
            <div class="msg">
              <div class="boxtitle">
                <p>
                  {{ item.title }}
                </p>
              </div>
              <div class="bottom">
                <span class="rate"
                  ><span style="margin-right: 5px">精选指数</span>
                  <el-rate disabled v-model="item.tjzs"></el-rate
                ></span>
                <span class="seeNum"
                  ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                >
              </div>
            </div>
          </div>
        </div> -->
        <!-- 高三二轮语文 -->
        <div class="gsYwerlun" v-if="tabvalue == 5 && kemu_id == 1">
          <img
            :src="item.file_url"
            v-for="(item, index) in erlunCHlist"
            :key="index"
            @click="
              gogszx(
                item.kejianbooks_id,
                item.kejianchapters_id,
                item.kejianfl_id,
                item.kejiantag_id,
                item.kemu_id,
                item.nianji_id,
                item.title,
                item.type_id,
                index,
                erlunCHlist
              )
            "
          />
        </div>
        <!-- 高三一轮英语产品 -->
        <div
          class="productLists"
          v-show="tabvalue == 7 || (tabvalue == 4 && kemu_id == 3)"
          v-for="item in prList"
          :key="item.id"
          @click="productDetails(item.id, item.type_id)"
        >
          <div class="pic">
            <img :src="item.file_url" alt="" />
          </div>
          <div class="msg">
            <div class="booktitle">{{ item.title }}</div>
            <!-- <div class="author">权威编者：{{ item.author }}</div> -->
            <div class="author">{{ item.synopsis }}</div>
          </div>
          <div class="goProduct" @click="productDetails(item.id, item.type_id)">
            查看样书
          </div>
        </div>
        <!-- 高三英语二轮课件查看全部 -->
        <div class="seemore" v-if="tabvalue == 5 && kemu_id == 3">
          <!-- <p>点击查看全部<i class="el-icon-arrow-right"></i></p> -->
        </div>
      </div>
      <div class="right">
        <div class="top">
          <h3>教学进度</h3>
          <span @click="goEditPlan"
            ><img src="../../assets/img/4.2/4.2edit.png" />修改教学计划</span
          >
        </div>
        <div class="jindu">
          <img src="../../assets/img/4.2/4.2jindu.png" alt="" />
          <span>当前进度：</span>
          <p>{{ base_title }}</p>
        </div>
        <div class="rili">
          <div class="xingqi">
            <span v-for="item in xingqiLists" :key="item.id">{{
              item.title
            }}</span>
          </div>
          <div class="day">
            <div
              class="monthdays"
              v-for="item in currentMonthCount"
              :key="item"
              @click="issingle(item)"
              :class="{
                kaishiqian: kaishiqian(item),
                jinxingzhong: isjxz(item),
                yijiesu: yijiesu(item),
                isxingqiqi: isxingqiqi(item),
                isxingqiyi: isxingqiyi(item),
                issingle: issingle(item),
              }"
            >
              <p
                v-if="isRiqi(item)"
                
              >
                {{ item }}
              </p>
              <div
                class="mulu"
                v-if="isText(item)"
              >
              <!-- v-show="
                start_date != end_date?(nowMonth == eMonth
                    ? stime - 7 != item && stime != item && etime + 1 != item 
                    : stime - 7 != item && stime != item ):(stime != item)
                  
                " -->
                {{ riqiTitle }}
              </div>
              <span class="biao">
                <div class="ksqText" v-if="ksqNum >= 5 && nianji_id != 11">
                  <p
                    v-if="stime - 6 == item"
                    style="width: 60px; text-align: right"
                  >
                    <img src="../../assets/img/4.2/4.2lingdang.png" alt="" />
                  </p>
                  <p v-if="stime - 5 == item" style="width: 60px">教学前 -</p>
                  <p v-if="stime - 4 == item" style="width: 60px">教师教研备</p>
                  <p v-if="stime - 3 == item" style="width: 60px">课资源包推</p>
                  <p
                    v-if="stime - 2 == item"
                    style="width: 60px; text-align: left"
                  >
                    送
                  </p>
                </div>
                <div class="jxzText" v-if="jxzNum >= 6 ">
                  <p
                    v-if="sMonth == nowMonth?
                      stime + (jxzNum > 8 ? 4 : 3) == item :
                      1+(jxzNum > 8 ? 4 : 3) == item
                    "
                    style="width: 60px"
                  >
                    <img src="../../assets/img/4.2/4.2lingdang.png" alt="" />
                    教学中
                  </p>
                  <p
                    v-if="sMonth == nowMonth?
                      stime + (jxzNum > 8 ? 5 : 4) == item :1+(jxzNum > 8 ? 5 : 4) == item
                    "
                    v-show=" nianji_id != 11"
                    style="width: 60px"
                  >
                    教师教学
                  </p>
                  <p
                    v-if="sMonth == nowMonth?
                      stime + (jxzNum > 8 ? 6 : 5) == item :1+(jxzNum > 8 ? 6 : 5) == item 
                    "
                    v-show=" nianji_id != 11"
                    style="width: 60px"
                  >
                    - 教学资源
                  </p>
                  <p
                    v-if="
                      stime + (jxzNum > 8 ? 6 : 5) == item && nianji_id == 11
                    "
                    style="width: 60px"
                  >
                    {{ timeLine.title }}
                  </p>
                  <p
                    v-if="
                      stime + (jxzNum > 8 ? 7 : 6) == item && nianji_id != 11
                    "
                    style="width: 60px"
                  >
                    包按课节推
                  </p>

                  <p
                    v-if="
                      stime + (jxzNum > 8 ? 8 : 7) == item && nianji_id != 11
                    "
                    style="width: 60px; text-align: left"
                  >
                    送
                  </p>
                </div>
                <div
                  class="yjsText"
                  v-if="nowMonth == eMonth && yjsNum >= 5 && nianji_id != 11"
                >
                  <p v-if="etime + 3 == item" style="width: 60px">
                    <img src="../../assets/img/4.2/4.2lingdang.png" alt="" />
                    已结束
                  </p>
                  <p v-if="etime + 4 == item" style="width: 60px">学生学习</p>
                  <p v-if="etime + 5 == item" style="width: 60px">- 复习资源</p>
                  <p
                    v-if="etime + 6 == item"
                    style="width: 60px; text-align: left"
                  >
                    包推送
                  </p>
                </div>
                <img
                  src="../../assets/img/4.2/4.2kaishiqian.png"
                  v-if="stime - 7 > 0 ? stime - 7 == item : item == 1"
                  v-show="sMonth == nowMonth && start_date != end_date && nianji_id !=11"
                />
                <img
                  src="../../assets/img/4.2/4.2jinxing.png"
                  v-if="nowMonth == sMonth ? stime == item : item == 1"
                  v-show="sMonth<=nowMonth"
                />
                <img
                  src="../../assets/img/4.2/4.2yijiesu.png"
                  v-if="etime + 1 == item && nowMonth == eMonth && start_date != end_date && nianji_id !=11"
                />
              </span>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="jyactive" v-if="kemu_id == 1 || kemu_id == 3">
      <div class="boxtitle">
        <div class="left">
          <h4>教研活动</h4>
        </div>
        <div class="right" @click="goActiveCenter">查看更多</div>
      </div>
      <div class="activeList">
        <div
          class="activeBox"
          v-for="item in activeList"
          :key="item.id"
          @click="goActiveDetails(item.id)"
        >
          <div class="pic">
            <img :src="item.file_url" />
          </div>
          <div class="activetitle">
            <p>{{ item.title }}</p>
          </div>
          <div class="activetime">
            {{ timeStamp2String(item.start_time * 1000, 2) }}
            {{ timeStamp2String(item.start_time * 1000, 5) }}（{{
              timeStamp2String(item.start_time * 1000, 11)
            }}）
          </div>
          <div
            class="dosome bm"
            v-if="
              item.bm_status == 0 && new Date().getTime() < item.end_time * 1000
            "
          >
            预约
          </div>
          <div
            class="dosome bm"
            v-if="
              item.bm_status == 1 && new Date().getTime() < item.end_time * 1000
            "
          >
            已预约
          </div>
          <div
            class="dosome zhibo"
            v-if="
              item.bm_status == 1 &&
              item.start_time * 1000 <
                new Date().getTime() <
                item.end_time * 1000
            "
          >
            进入直播
          </div>
          <div
            class="dosome huifang"
            v-if="new Date().getTime() > item.end_time * 1000 && item.have_video == 1"
          >
            查看回放
          </div>
          <div
            class="dosome huifang"
            v-if="new Date().getTime() > item.end_time * 1000 && item.have_video == 0" 
          >
            暂无回放
          </div>
        </div>
        <div class="seemoreactive">
          <img src="../../assets/img/4.2/indexacpic.png" alt="" />
          <div class="gomoreactive" @click="goActiveCenter">
            查看更多精彩活动
          </div>
        </div>
      </div>
    </div>
    <div class="product" v-show="booklist.length != 0">
      <div class="boxtitle">
        <div class="left">
          <h4>参考资料推荐</h4>
        </div>
        <div class="right" @click="goResourceCenter">查看更多</div>
      </div>
      <div class="recommend">
        <div class="jiaofuBooks">
          <div class="tips">
            <img src="../../assets/img/product_jx.png" alt="" />
            <!-- <h2>为你精选</h2>
          <p>教辅图书</p> -->
          </div>
          <div class="bookSwiper">
            <div class="booksList" ref="booksList">
              <div
                class="box"
                v-for="item in booklist"
                :key="item.id"
                @click="productDetails(item.id, item.type_id)"
              >
                <div class="pic">
                  <img :src="item.file_url" />
                </div>
                <h4>{{ item.title }}</h4>
                <!-- <p>权威编者：{{ item.author }}</p> -->
              </div>
            </div>
            <span class="leftN anniu" @click="bookLeft"
              ><i class="el-icon-arrow-left"></i
            ></span>
            <span class="rightN anniu" @click="bookRight"
              ><i class="el-icon-arrow-right"></i>
            </span>
          </div>
        </div>
      </div>
    </div>
    <!-- 首次进入网站未有年级科目版本弹窗 -->
    <el-dialog
      title=""
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      center
      width="600px"
    >
      <div class="chose">
        <p>1.请选择您所在的年级：</p>
        <div class="tab1 taps">
          <div
            class="classRadio"
            v-for="item in nianjiList"
            :key="item.id"
            @click="radio3 = item.id"
          >
            <div class="tips1 tips" v-if="radio3 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio3 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <p>2.请选择您所教的学科：</p>
        <div class="tab1 taps">
          <div
            class="classRadio"
            v-for="item in classList"
            :key="item.id"
            @click="changeKemu(item.id)"
          >
            <div class="tips1 tips" v-if="radio1 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio1 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <p>3.请选择您所教学科的教学版本：</p>
        <div class="tab2 taps">
          <div
            class="classRadio"
            v-for="item in banbenList"
            :key="item.id"
            @click="radio2 = item.id"
          >
            <div class="tips1 tips" v-if="radio2 != item.id"><span></span></div>
            <div class="tips2 tips" v-if="radio2 == item.id"><span></span></div>
            <p>{{ item.title }}</p>
          </div>
        </div>
        <div class="submitSet" @click="submit">
          <span>提交</span>
        </div>
      </div>
    </el-dialog>
    <!-- 更新提醒弹窗 -->
    <gxtxTc
      v-if="gxtxShow"
      @gxtcClose="gxtcClose"
      :zykf_file_url="zykf_file_url"
    >
    </gxtxTc>
  </div>
</template>

<script>
import { timeStamp2String } from "../../utils/time";
import gxtxTc from "../../components/gxtxTc/gxtx.vue"
import {
  banner,
  sjtj,
  nowkemu,
  userinfo,
  zyzxinfo,
  zyzxgs,
  activityindex,
  getbookbyprogress,
  nianjilists,
  kemulists,
  versionslists,
  setnowkemu,
  list_kejian,
  productinfo,
  chapterskejian,
  chapterskejian_new,
  page_times,
  getgoodsweekpopup,
  closepopup,
  groupbuygoodsinfo
} from "../../api/http";
export default {
  components: {gxtxTc},
  props: ["xitongMsg", "kefuMsg"],
  data() {
    return {
      bannerHeight: "",
      dialogTableVisible: false, //提交信息弹窗

      bannerList: [], //banner图表
      timeStamp2String, //时间戳转时间的函数
      //个人数据
      ljrzts: 0, //累计入驻天数
      bxyzcyh: 0, //本校已注册用户
      ljzyxz: 0, //累计资源下载
      ljzxsc: 0, //累计在线时长
      pjtlsc: 0, //平均在线时长
      ljfwcs: 0, //累计访问次数
      ljcjhds: 0, //累计参加活动数
      type: "", //个人数据还是学校数据

      //为您定制
      zyzxMsg: {}, //资源数据汇总信息
      base_title: "", //当前计划名称标题
      kejianbooks_title: "", //当前学习的书本名
      kejianchapters_title: "", //当前学习的目录名
      fenlei_radio: 1, //试卷分类值
      smonth: "", //计划开始的月份
      emonth: "", //计划结束的月份
      kejianbao_nums: "", //资源包数量
      kejian_nums: "", //资源数量
      kejianbooks_id: 0, //书本id
      kemu_id: 0, //当前科目id
      nianji_id: 0, //当前年级id
      kejianversions_id: 0, //当前版本id
      kejianchapters_id: 0, //目录id
      status: "", //是否当前
      nowMonth: "", //当前几月份
      // 资源定制部分
      dingzhishow: true, //定制部分是否展示
      dingzhiRadio: "1", //定制切换栏按钮默认值
      //资源包信息介绍
      contents: "", //整理来源介绍
      contents1: "", //教师教研介绍//一轮复习介绍
      contents2: "", //教师教学介绍//二轮复习介绍
      contents3: "", //学生学习介绍//三轮复习介绍 //暂无
      contents4: "", //真题试卷介绍
      //高一高二
      gyezyLists: [], //教师教研课件包
      gyespLists: [], //教师教学视频
      gyezy1: 0, //高一二部分教师教研资源数量
      gyezy2: 0, //高一二部分教师教学资源数量
      gyezy3: 0, //高一二部分学生学习资源数量

      gyesp1: 0, //高一二部分教师教研视频数量
      gyesp2: 0, //高一二部分教师教学视频数量
      gyesp3: 0, //高一二部分学生学习视频数量

      radio: "1", //调查有用没用
      beikeFlag: false, //资源包hover样式切换
      n: 0, //当前鼠标移动到的资源包的id

      //高三部分
      gszyLists: [], //高三部分的最新资源列表
      gszxLists: [], //高三部分的专项列表
      gsspLists: [], //高三部分的视频列表
      gszy1: 0, //一轮复习课件包数量
      gszy2: 0, //二轮复习课件包数量
      gszy3: 0, //试卷课件包数量
      gszx1: 0, //一轮复习专项数量
      gszx2: 0, //二轮复习专项数量
      gszx3: 0, //试卷专项数量
      gssp1: 0, //一轮复习视频数量
      gssp2: 0, //二轮复习视频数量
      gssp3: 0, //试卷视频数量
      gs: 0, //高三部分鼠标移动到的资源包id
      nothingShow: false, //空图是否展示

      //推荐活动和产品
      timeNow: new Date().getTime(), //当前时间的时间戳
      activeId: "", //推荐的活动的id
      file_url: "", //活动封面
      start_time: "", //活动开始时间
      end_time: "", //活动结束时间
      acTitle: "", //活动主题
      bm_status: 0, //活动报名状态
      hdxd_nums: 0, //活动更新数量
      prList: [], //推荐产品列表
      haveAc: true, //有没有推荐的活动
      havePr: true, //有没有推荐的产品

      //首次进入弹窗相关内容
      nianjiList: [], //可选年级列表
      classList: [], //学科列表
      banbenList: [], //版本列表
      radio3: "", //年级值
      radio1: "", //学科值
      radio2: "", //版本值

      //4.2版本
      tabvalue: 1, //tab值
      boxLeft: 0, //图片滚动距离
      newLists: [], //最新资源列表
      newshijuanLists: [], //最新资源列表
      activeList: [], //主页活动推荐
      booklist: [], //主页精选产品列表
      yilunBook_id: "", //一轮书本id
      erlunBook_id: "", //二轮书本id
      yilunCHlist: [], //一轮语文复习数据
      erlunCHlist: [], //二轮语文复习数据
      yilunENlist: [], //一轮英语复习数据
      erlunENlist: [], //二轮英语复习数据
      shijuanlist: [], //英语试卷数据
      beizhanPicLists:[],//备战高考图片列表

      smallpic: [], //小图banner

      //日历所用
      date: "", //当前日期
      start_date: "", //当前计划开始时间
      end_date: "", //当前计划结束时间
      stime: "", //开始的那一天
      etime: "", //结束的那天
      xingqiLists: [
        { id: 1, title: "一" },
        { id: 2, title: "二" },
        { id: 3, title: "三" },
        { id: 4, title: "四" },
        { id: 5, title: "五" },
        { id: 6, title: "六" },
        { id: 7, title: "七" },
      ], //星期一至七
      currentMonthCount: 0, //本月天数
      nowMonth: new Date().getMonth() + 1, //当前月份
      sMonth: 0, //开始是几月
      eMonth: 0, //开始是几月
      ksqNum: 0, //开始前在日历上的展示数量
      jxzNum: 0, //进行中在日历上的展示数量
      yjsNum: 0, //已结束在日历上的展示数量
      xingqiStime: "", //开始时间是星期几
      xingqiEtime: "", //借宿时间是星期几
      timeLine: {}, //高三关键时间节点
      riqiTitle:'',//展示再开始前进行中已结束的四个字
      from_account_id:'',//用户id


      gxtxShow:false,//更新提醒弹窗展示
      zykf_file_url:'',
    };
  },
  created() {
    // groupbuygoodsinfo({
    //   md5key: localStorage.getItem("md5key"),
    //   kemu_id:1,
    //   nianji_id:9
    // }).then(res=>{
    //   console.log(res)
    // })
    //回到顶部
    $(document).ready(function () {
      $(window).scrollTop(0);
    });
    //获取当前个人信息
    userinfo({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      this.from_account_id = res.retRes.id
      if (res.retInt == 1) {
        this.getbanner(); //获取banner
        this.getnum(); //获取数据统计
        this.getactive(); //获取主页活动列表
        this.getproduct(); //获取主页推荐产品
        this.getbookbyprogress(); //获取主页资源内嵌产品
        if (
          res.retInt == 1 &&
          res.retRes.sy_end_time * 1000 > Date.parse(new Date())
        ) {
          // console.log(res, "个人信息");
          const data = res.retRes;
          this.nianji_id = data.nianji_id; //当前年级id
          this.radio3 = data.nianji_id; //赋值初次弹窗年级id
          this.kemu_id = data.kemu_id;
          this.radio1 = data.kemu_id; //赋值初次弹窗科目id
          if (this.nianji_id != 11) {
            this.tabvalue = 1;
            //获取进入页面后上半部分的资源包和当前计划的高一高二相关数据
            zyzxinfo({
              md5key: localStorage.getItem("md5key"),
            }).then((res) => {
              if (res.retInt == 1) {
                console.log(res, "课件包数据信息汇总");
                const data = res.retRes;
                this.base_title = data.base_title;
                this.start_date = data.start_date
                  ? data.start_date
                  : data.timeline.start_date; //教学计划开始时间
                this.end_date = data.end_date?data.end_date:data.timeline.end_date; //教学计划结束时间

                (this.sMonth = this.timeStamp2String(
                  new Date(this.start_date).getTime(),
                  16
                )), //开始是几月
                  (this.eMonth = this.timeStamp2String(
                    new Date(this.end_date).getTime(),
                    16
                  )); //结束是几月

                this.xingqiStime = new Date(this.start_date).getDay();
                this.xingqiEtime = new Date(this.end_date).getDay();
                // console.log(this.xingqiStime, this.xingqiEtime);
                this.contents = data.contents;
                this.contents1 = data.info_1.contents;
                this.contents2 = data.info_2.contents;
                this.contents3 = data.info_3.contents;
                this.kejianbao_nums = data.kejianbao_nums;
                this.kejian_nums = data.kejian_nums;
                this.zyzxMsg = data; //汇总信息
                // this.gyespLists = data.info_1.sp_lists;
                this.gyezy1 = data.info_1.zy_lists.length; //高一二部分教师教研资源数量
                this.gyezy2 = data.info_2.zy_lists.length; //高一二部分教师教学资源数量
                this.gyezy3 = data.info_3.zy_lists.length; //高一二部分学生学习资源数量
                if (this.gyezy1 > 0) {
                  this.tabvalue = 1;
                  this.gyezyLists = data.info_1.zy_lists;
                } else if (this.gyezy1 == 0 && this.gyezy2 > 0) {
                  this.tabvalue = 2;
                  this.gyezyLists = data.info_2.zy_lists;
                } else if (this.gyezy1 == 0 && this.gyezy2 == 0) {
                  this.tabvalue = 3;
                  this.gyezyLists = data.info_3.zy_lists;
                }
                this.$emit("mount");
              }
            });
          } else {
            // console.log(this.$route.query);
            if (this.$route.query.tapvalue) {
              this.tabvalue = this.$route.query.tapvalue;
              this.dingzhiRadio = this.$route.query.tapvalue;
            } else {
              this.tabvalue = 4;
            }
            // console.log(this.tabvalue);
            zyzxgs({
              md5key: localStorage.getItem("md5key"),
            }).then((res) => {
              if (res.retInt == 1) {
                console.log(res, "高三资源中心信息汇总");
                //备战高考内容
                banner({
                  md5key: localStorage.getItem("md5key"),
                  systypes_id:10008,
                  device_type_id:201
                }).then(res=>{
                  // console.log(res,"备战高考内容图片")
                  this.beizhanPicLists = res.retRes
                })
                const data = res.retRes;
                this.contents = data.contents; //高三定制资源简介
                this.contents1 = data.info_1.contents;
                this.contents2 = data.info_2.contents;
                this.contents4 = data.info_4.contents;
                this.kejianbao_nums = data.kejianbao_nums;
                this.kejian_nums = data.kejian_nums;
                this.zyzxMsg = data; //汇总信息
                this.yilunBook_id = data.info_1.kejianbooks_id;
                this.erlunBook_id = data.info_2.kejianbooks_id;
                this.shijuanlist = data.info_4.zx_lists;
                // 一轮二轮复习内容
                if (this.kemu_id == 1) {
                  this.yilunCHlist = data.info_1.zx_lists;
                  this.erlunCHlist = data.info_2.zx_lists;
                } else if (this.kemu_id == 3) {
                  // 高三一轮英语
                  chapterskejian({
                    md5key: localStorage.getItem("md5key"),
                    kejianbooks_id: this.yilunBook_id,
                  }).then((res) => {
                    this.yilunENlist = res.retRes;
                  });
                  //高三二轮英语
                  chapterskejian_new({
                    md5key: localStorage.getItem("md5key"),
                    kejianbooks_id: this.erlunBook_id,
                  }).then((res) => {
                    this.erlunENlist = res.retRes;
                  });
                }
                this.base_title = data.base_title;
                 this.start_date = data.start_date
                  ? data.start_date
                  : data.timeline.start_date; //教学计划开始时间
                this.end_date = data.end_date?data.end_date:data.timeline.end_date; //教学计划结束时间

                (this.sMonth = this.timeStamp2String(
                  new Date(this.start_date).getTime(),
                  16
                )), //开始是几月
                  (this.eMonth = this.timeStamp2String(
                    new Date(this.end_date).getTime(),
                    16
                  )); //开始是几月

                
                
              }
            });
          }
          //获取当前科目和版本
          nowkemu({
            md5key: localStorage.getItem("md5key"),
          }).then((res) => {
            if (res.retInt == 1) {
              // console.log(res, "当前科目和版本");
              const data = res.retRes;
              this.status = data.is_now; //是否当前

              //如果当前的版本或科目为0，跳转到选择版本页
              if (data.kejianversions_id == 0 || data.kemu_id == 0) {
                // this.$alert("您还未选择学科或版本，请先前往选择", "温馨提示", {
                //   confirmButtonText: "确定",
                //   callback: () => {
                //     this.$router.push({
                //       name: "ChangeClass",
                //     });
                //   },
                // });
                //如果当前的计划开始时间结束时间不存在或科目为0，跳转到设置教学计划
              } else if (data.have_plan == 0) {
                // this.$alert("您目前还没有教学计划，请先前往设置", "温馨提示", {
                //   confirmButtonText: "确定",
                //   callback: () => {
                //     this.$router.push({
                //       name: "MyTeachPlan",
                //     });
                //   },
                // });
              } else {
                this.kejianversions_id = data.kejianversions_id; //当前版本id
                this.radio2 = data.kejianversions_id; //赋值初次弹窗版本id
                this.kejianchapters_id = data.kejianchapters_id; //当前目录id
                this.kejianbooks_id = data.kejianbooks_id; //当前书本id
                // this.start_date = data.start_date; //教学计划开始时间
                // this.end_date = data.end_date; //教学计划结束时间
                this.kemu_id = data.kemu_id; //当前科目id
                
                this.kejianbooks_title = data.kejianbooks_title; //当前学习的书本名
                this.kejianchapters_title = data.kejianchapters_title; //当前学习的目录名
                this.timeLine = data.timeline;
                this.riqiTitle = data.kejianchapters_title?data.kejianchapters_title.substring(0,4):data.timeline.title
                // console.log(data.timeline,this.riqiTitle);
                // 一进来就要判断的目录id，如果有，正常显示，如果没有，隐藏推荐
                this.getnewziyuan(); //获取首页最新资源
                this.getnewshijuan();//获取首页最新试卷
              }
            } else {
              this.$notify.error({
                title: "错误",
                message: res.retErr,
                duration: 2000,
                showClose: false,
              });
            }
          });
          //如果后端提示需要设置年级科目版本
          if (res.retRes.kemunianji_set == 0) {
            this.dialogTableVisible = true;
            //获取年级列表数据
            nianjilists({ md5key: localStorage.getItem("md5key") }).then(
              (res) => {
                // console.log(res, "年级列表");
                const data = res.retRes;
                if (res.retInt == 1) {
                  this.nianjiList = data;
                }
              }
            );
            //获取科目列表
            kemulists({ md5key: localStorage.getItem("md5key") }).then(
              (res) => {
                // console.log(res, "科目列表");
                const data = res.retRes;
                if (res.retInt == 1) {
                  this.classList = data;
                }
              }
            );
            setTimeout(() => {
              //获取教学版本列表
              versionslists({
                md5key: localStorage.getItem("md5key"),
                kemu_id: this.radio1 ? this.radio1 : "1",
              }).then((res) => {
                // console.log(res, "版本列表");
                const data = res.retRes;
                if (res.retInt == 1) {
                  this.banbenList = data;
                }
              });
            }, 200);
          }
        } else if (res.retRes.sy_end_time * 1000 < Date.parse(new Date())) {
          this.$router.push({
            name: "Login",
            query: {
              isgq: 1,
            },
          });
        }
      }
    });

    this.date = new Date(); //获取当前日期
    this.currentMonthCount = new Date(
      this.date.getFullYear(),
      this.date.getMonth() + 1,
      0
    ).getDate(); //获取本月天数
    console.log(this.currentMonthCount)
  },
  mounted() {
    getgoodsweekpopup({
      md5key: localStorage.getItem("md5key"),
    }).then(res=>{
      if(res.retRes == 1){
        this.gxtxShow = true
        this.zykf_file_url = this.kefuMsg.qwkf_file_url
      }
    })
    //重定向
    localStorage.setItem("path", "");

    const monthfirst = new Date(this.date.setDate(1)).getDay() >0?new Date(this.date.setDate(1)).getDay():7; //本月一号是星期几
    const monthdays = document.querySelector(".monthdays"); //获取本月一号的html
    monthdays.style.marginLeft = (monthfirst - 1) * 60 + "px"; //设置本月一号应该在星期几的位置
    console.log(monthfirst)
    // document.querySelectorAll('.monthdays')[2].innerHTML = '123'
    // document.querySelectorAll('.monthdays')[2].style.fontSize = 12+'px'
    //用于在mounted里获取到data中才created里才获取到的数据

    this.$on("mount", () => {
    });
    setTimeout(() => {
      this.stime = this.timeStamp2String(
        new Date(this.start_date).getTime(),
        15
      ); //开始那天是几号
      this.etime = this.timeStamp2String(new Date(this.end_date).getTime(), 15); //结束那天是几号
      // console.log(this.stime, this.etime,"123456");

      const kaishiqian = document.querySelectorAll(".kaishiqian");
      this.ksqNum = kaishiqian.length;
      if (kaishiqian.length > 0) {
        kaishiqian[0].style.borderTopLeftRadius = "4px";
        kaishiqian[0].style.borderBottomLeftRadius = "4px";
        kaishiqian[kaishiqian.length - 1].style.borderTopRightRadius = "4px";
        kaishiqian[kaishiqian.length - 1].style.borderBottomRightRadius = "4px";

        kaishiqian[0].childNodes[2].style.background = "#ebfaf5";
        kaishiqian[1].childNodes[2].style.marginLeft = 5 + "px";
        kaishiqian[1].childNodes[2].style.borderTopLeftRadius = "4px";
        kaishiqian[1].childNodes[2].style.borderBottomLeftRadius = "4px";
        kaishiqian[kaishiqian.length - 1].childNodes[2].style.marginRight =
          4 + "px";
        kaishiqian[
          kaishiqian.length - 1
        ].childNodes[2].style.borderTopRightRadius = "4px";
        kaishiqian[
          kaishiqian.length - 1
        ].childNodes[2].style.borderBottomRightRadius = "4px";
        kaishiqian[kaishiqian.length - 1].childNodes[2].style.width = "56px";
        // console.log(kaishiqian);
      }

      const jinxingzhong = document.querySelectorAll(".jinxingzhong");
      this.jxzNum = jinxingzhong.length;
      // console.log(this.jxzNum,"123456789")
      if (jinxingzhong.length > 0) {
        jinxingzhong[0].style.borderTopLeftRadius = "4px";
        jinxingzhong[0].style.borderBottomLeftRadius = "4px";
        jinxingzhong[jinxingzhong.length - 1].style.borderTopRightRadius =
          "4px";
        jinxingzhong[jinxingzhong.length - 1].style.borderBottomRightRadius =
          "4px";

        jinxingzhong[0].childNodes[2].style.background = "#fceded";
        jinxingzhong[1].childNodes[2].style.marginLeft = 5 + "px";
        jinxingzhong[1].childNodes[2].style.borderTopLeftRadius = "4px";
        jinxingzhong[1].childNodes[2].style.borderBottomLeftRadius = "4px";
        jinxingzhong[jinxingzhong.length - 1].childNodes[2].style.marginRight =
          4 + "px";
        jinxingzhong[
          jinxingzhong.length - 1
        ].childNodes[2].style.borderTopRightRadius = "4px";
        jinxingzhong[
          jinxingzhong.length - 1
        ].childNodes[2].style.borderBottomRightRadius = "4px";
        jinxingzhong[jinxingzhong.length - 1].childNodes[2].style.width =
          "56px";
      }

      const yijiesu = document.querySelectorAll(".yijiesu");
      this.yjsNum = yijiesu.length;
      if (yijiesu.length > 0) {
        yijiesu[0].style.borderTopLeftRadius = "4px";
        yijiesu[0].style.borderBottomLeftRadius = "4px";
        yijiesu[yijiesu.length - 1].style.borderTopRightRadius = "4px";
        yijiesu[yijiesu.length - 1].style.borderBottomRightRadius = "4px";

        yijiesu[0].childNodes[2].style.background = "#ebfaf5";
        yijiesu[1].childNodes[2].style.marginLeft = 5 + "px";
        yijiesu[1].childNodes[2].style.borderTopLeftRadius = "4px";
        yijiesu[1].childNodes[2].style.borderBottomLeftRadius = "4px";
        yijiesu[yijiesu.length - 1].childNodes[2].style.marginRight = 4 + "px";
        yijiesu[yijiesu.length - 1].childNodes[2].style.borderTopRightRadius =
          "4px";
        yijiesu[
          yijiesu.length - 1
        ].childNodes[2].style.borderBottomRightRadius = "4px";
        yijiesu[yijiesu.length - 1].childNodes[2].style.width = "56px";
      }
    }, 1000);
  },
  methods: {
    gxtcClose(){
      this.gxtxShow = false
      closepopup({
        md5key: localStorage.getItem("md5key"),
      })
    },
    //每天的时间戳
    isjxz(time) {
      // console.log(new Date(this.timeStamp2String(this.date,14) + time).getTime())//当前月份加上点击的日期 也就是选中的日期的时间戳
      // console.log(new Date(this.timeStamp2String(this.date,14) + time).getTime() > new Date(this.start_date).getTime())
      // console.log(new Date(this.timeStamp2String(this.date,14) + time).getTime()>= new Date(this.start_date).getTime())
      // return new Date(this.end_date).getTime()>=new Date(this.timeStamp2String(this.date,14) + time).getTime() >= new Date(this.start_date).getTime()
      // console.log(new Date(this.timeStamp2String(this.date, 14) + time).getTime(),new Date(this.end_date).getTime(),time)
      return (
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
          8 * 3600 * 1000 >=
          new Date(this.start_date).getTime() &&
        new Date(this.end_date).getTime() >=
          new Date(this.timeStamp2String(this.date, 14) + time).getTime()
      );
    },
    kaishiqian(time) {
      // return this.stime >= item && this.stime - 6 <= item
      return (
        new Date(this.start_date).getTime() - 7 * 24 * 3600 * 1000 <=
          new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
            +8 * 3600 * 1000 &&
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
          8 * 3600 * 1000 <
          new Date(this.start_date).getTime() && new Date(this.start_date).getTime() != new Date(this.end_date).getTime()
          && this.nianji_id !=11
      );
    },
    yijiesu(time) {
      return (
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() >
          new Date(this.end_date).getTime() &&
        new Date(this.end_date).getTime() + 7 * 24 * 3600 * 1000 >=
          new Date(this.timeStamp2String(this.date, 14) + time).getTime()  && new Date(this.start_date).getTime() != new Date(this.end_date).getTime()
          && this.nianji_id !=11
      );
    },
    isxingqiyi(time) {
      let type =
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
        8 * 3600 * 1000;
      if (new Date(type).getDay() == 1) {
        return true;
      } else {
        return false;
      }
    },
    isxingqiqi(time) {
      let type =
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
        8 * 3600 * 1000;
      if (new Date(type).getDay() == 0) {
        return true;
      } else {
        return false;
      }
    },
    issingle(time) {  
      // console.log(this.stime, this.etime, time);
      let type =
        new Date(this.timeStamp2String(this.date, 14) + time).getTime() +
        8 * 3600 * 1000;
      if (this.stime + 1 == time && new Date(type).getDay() == 0) {
        return true;
      } else if (this.etime == time && new Date(type).getDay() == 0) {
        return true;
      } else if (this.stime + 1 == time && new Date(type).getDay() == 1) {
        return true;
      } else if (this.etime == time && new Date(type).getDay() == 1) {
        return true;
      } else if (this.etime + 7 == time && new Date(type).getDay() == 1) {
        return true;
      } else if (this.stime == time && new Date(type).getDay() == 0) {
        return true;
      } else if (this.stime - 6 == time && new Date(type).getDay() == 0) {
        return true;
      } else if (this.stime == time && new Date(type).getDay() == 1) {
        return true;
      }
    },
    // 是否展示每天日期
    isRiqi(item){
      const s =  new Date(this.start_date).getTime();
      const e =  new Date(this.end_date).getTime();
      console.log(this.eMonth,this.nowMonth)
      return(
        (this.stime != item && this.stime-7 != item && s!=e && this.sMonth == this.nowMonth) 
      || 
      (this.stime != item && this.sMonth == this.nowMonth) 
      || 
      (this.stime != item && this.etime + 1 != item && s!=e && this.sMonth == this.nowMonth) 
      || 
      ( item != 1 && s!=e && this.sMonth < this.nowMonth)
      )
      ||this.sMonth>this.nowMonth
    },
    // 是否展示单元名字
    isText(item){
      const s =  new Date(this.start_date).getTime();
      const e =  new Date(this.end_date).getTime();
      // console.log(item,this.sMonth,this.nowMonth,item == 1 && s!=e && this.sMonth < this.nowMonth)
      // return((this.stime-7 == item) && s!=e||(this.stime = item) || (this.etime + 1 == item && s!=e))
      return((this.stime-7 == item && s!=e && this.sMonth == this.nowMonth && this.nianji_id !=11) ||
      (this.stime == item && this.sMonth == this.nowMonth) || 
      (this.etime + 1 == item && s!=e && this.sMonth == this.nowMonth && this.nianji_id !=11) || 
      ( item == 1 && s!=e && this.sMonth < this.nowMonth)
      )
    },
    clickit(item) {
      var date = new Date();
      date.setDate(1);
      var cTime = new Date(new Date(date).toLocaleDateString()).getTime(); //获取本月一号时间戳

      // console.log(new Date(this.start_date).getTime(),cTime);
      // console.log(cTime > new Date(this.start_date).getTime());
      // console.log(cTime < new Date(this.end_date).getTime());
      //如果本月一号大于计划开始时间并小于计划结束时间
      if (
        cTime > new Date(this.start_date).getTime() &&
        cTime < new Date(this.end_date).getTime()
      ) {
      } else if (cTime < new Date(this.start_date).getTime()) {
      }
    },
    //获取主页banner图
    getbanner() {
      banner({
        md5key: localStorage.getItem("md5key"),
        systypes_id: 10007,
        device_type_id: 201,
      }).then((res) => {
        // console.log(res, "主页banner");
        if (res.retInt == 1) {
          this.bannerList = res.retRes;
        } else if (res.retInt == 0) {
          this.$message.error(res.retErr);
        }
      });
      banner({
        md5key: localStorage.getItem("md5key"),
        systypes_id: 10006,
        device_type_id: 201,
      }).then((res) => {
        // console.log(res, "主页banner小图");
        if (res.retRes.length > 3) {
          this.smallpic = res.retRes.slice(0, 3);
        } else {
          this.smallpic = res.retRes;
        }

        // if (res.retInt == 1) {
        //   this.bannerList = res.retRes;
        // } else if (res.retInt == 0) {
        //   this.$message.error(res.retErr);
        // }
      });
    },
    //获取主页数据统计
    getnum() {
      sjtj({
        md5key: localStorage.getItem("md5key"),
      }).then((res) => {
        // console.log(res, "数据统计");
        const data = res.retRes;
        if (res.retInt == 1) {
          this.ljrzts = data.ljrzts;
          this.bxyzcyh = data.bxyzcyh;
          this.ljzyxz = data.ljzyxz;
          this.ljzxsc = data.ljzxsc;
          this.pjtlsc = data.pjtlsc;
          this.ljfwcs = data.ljfwcs;
          this.ljcjhds = data.ljcjhds;
          this.type = data.type;
        } else if (res.retInt == 0) {
          this.$message.error(res.retErr);
        }
      });
    },
    //获取主页产品推荐
    getbookbyprogress() {
      getbookbyprogress({
        md5key: localStorage.getItem("md5key"),
      }).then((res) => {
        // console.log(res, "产品推荐");
        this.prList = res.retRes;
      });
    },
    //获取首页最新资源
    getnewziyuan() {
      list_kejian({
        md5key: localStorage.getItem("md5key"),
        nianji_ids: this.nianji_id,
        kemu_id: this.kemu_id,
        kejianversions_id: this.kejianversions_id,
        of:"time",
        from_int: 10,
      }).then((res) => {
        // console.log(res, "最新资源");
        if (res.retRes.length > 5) {
          this.newLists = res.retRes.slice(0, 5);
        } else {
          this.newLists = res.retRes;
        }
      });
    },
    //获取首页最新试卷
    getnewshijuan() {
      list_kejian({
        md5key: localStorage.getItem("md5key"),
        nianji_ids: this.nianji_id,
        kemu_id: this.kemu_id,
        kejianversions_id: this.kejianversions_id,
        of:"time",
        type_id: 2,
        from_int: 10,
      }).then((res) => {
        // console.log(res, "最新试卷");
        if (res.retRes.length > 10) {
          this.newshijuanLists = res.retRes.slice(0, 5);
        } else {
          this.newshijuanLists = res.retRes;
        }
      });
    },
    //前往同步资源页
    gotobu() {
      this.$router.push({
        name: "ResourceTb",
        query: {
          from: "index",
          fliter: "zy",
        },
      });
    },
    //主页试卷查看更多
    sjseemore() {
      this.$router.push({
        name: "ResourceTb",
        query: {
          from: "index",
          fliter: "sj",
        },
      });
    },
    //前往高三英语词汇语法页
    gochyf(id, title, type) {
      this.$router.push({
        name: "Gszy",
        query: {
          type: this.tabvalue,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianbooks_id:
            type == 1
              ? this.zyzxMsg.info_1.kejianbooks_id
              : this.zyzxMsg.info_2.kejianbooks_id,
          kejianchapters_id: id,
          path: this.$route.path + "?tapvalue=" + this.tabvalue,
          routeName: "首页",
          title: title,
        },
      });
    },
    //主页活动推荐
    getactive() {
      activityindex({
        md5key: localStorage.getItem("md5key"),
      }).then((res) => {
        if (res.retInt == 1) {
          // console.log(res, "首页活动推荐");
          if (res.retRes.length != 0) {
            // const data = res.retRes[0];
            this.activeList = res.retRes;
            // this.file_url = data.file_url;
            // this.acTitle = data.title;
            // this.start_time = data.start_time;
            // this.end_time = data.end_time;
            // this.hdxd_nums = data.hdxd_nums;
            // this.bm_status = data.bm_status;
            // this.activeId = data.id;
            // console.log(this.activeId, "asdasd ");
          } else {
            this.haveAc = false;
          }
        }
      });
    },
    //主页精选产品
    getproduct() {
      productinfo({
        md5key: localStorage.getItem("md5key"),
        // type_id: 1, //默认产品分类为高中语文
      }).then((res) => {
        // console.log(res, "产品首页中心");
        this.booklist = res.retRes.topbooklist; //顶部精选
      });
    },
    //前往图书详情页
    productDetails(id, type_id) {
      // console.log(id, type_id);
      if (type_id == 1) {
        this.$router.push({
          name: "ProductDetails",
          query: {
            id: id,
          },
        });
      } else if (type_id == 2) {
        this.$router.push({
          name: "ClassOnline",
          query: {
            id: id,
          },
        });
      } else if (type_id == 3) {
        this.$router.push({
          name: "JingtingDetails",
          query: {
            id: id,
          },
        });
      }
    },
    //图书轮播左按钮
    bookLeft() {
      const box = this.$refs.booksList;
      const picWidth = 240;
      this.boxLeft += 240;
      // console.log(this.boxLeft);
      box.style.left = this.boxLeft + "px";
      box.style.transition = "all 0.5s ease-in-out";
      console.log(this.boxLeft);
      if (this.boxLeft > 0) {
        box.style.left = -picWidth * (this.booklist.length - 4) + "px";
        this.boxLeft = -picWidth * (this.booklist.length - 4);
      }
      // console.log(box.style.left);
    },
    //图书轮播右按钮
    bookRight() {
      const box = this.$refs.booksList;
      const picWidth = 240;
      this.boxLeft -= 240;
      box.style.left = this.boxLeft + "px";
      box.style.transition = "all 0.5s ease-in-out";
      // console.log(this.boxLeft);
      // console.log(box.style.left);
      if (this.boxLeft < -(this.booklist.length - 4) * picWidth) {
        box.style.left = 0 + "px";
        this.boxLeft = 0;
      }
    },
    //跳转广告图
    advert(href,id) {
      page_times({
        md5key: localStorage.getItem("md5key"),
        table_name:'banner',
        row_id:id,
        times:0,
        from_account_id:0
      }).then(

      )
      window.open(href, "_blank");
    },
    //调整教学计划
    goEditPlan() {
      this.$router.push({
        name: "MyTeachPlan",
      });
    },
    //切换教学栏,资源切换
    changetab(e) {
      this.dingzhiRadio = e;
      this.tabvalue = e;
      if (e == "1") {
        this.gyezyLists = this.zyzxMsg.info_1.zy_lists;
        this.gyespLists = this.zyzxMsg.info_1.sp_lists;
      } else if (e == "2") {
        this.gyezyLists = this.zyzxMsg.info_2.zy_lists;
        this.gyespLists = this.zyzxMsg.info_2.sp_lists;
      } else if (e == "3") {
        this.gyezyLists = this.zyzxMsg.info_3.zy_lists;
        this.gyespLists = this.zyzxMsg.info_3.sp_lists;
      } else if (e == "4") {
        this.gszyLists = this.zyzxMsg.info_1.zy_lists;
        this.gszxLists = this.zyzxMsg.info_1.zx_lists;
        this.gsspLists = this.zyzxMsg.info_1.sp_lists;
      } else if (e == "5") {
        this.gszyLists = this.zyzxMsg.info_2.zy_lists;
        this.gszxLists = this.zyzxMsg.info_2.zx_lists;
        this.gsspLists = this.zyzxMsg.info_2.sp_lists;
        //高三二轮英语
        // list_kejian({
        //   md5key: localStorage.getItem("md5key"),
        //   kemu_id: this.kemu_id,
        //   nianji_ids: this.nianji_id,
        //   from_int: 10,
        //   kejianversions_id: this.kejianversions_id,
        //   kejianbooks_id: this.erlunBook_id,
        // }).then((res) => {
        //   console.log(res);
        //   this.erlunENlist = res.retRes;
        // });
      } else if (e == "6") {
        this.gszyLists = this.zyzxMsg.info_4.zy_lists;
        this.gszxLists = this.zyzxMsg.info_4.zx_lists;
        this.gsspLists = this.zyzxMsg.info_4.sp_lists;
      }
    },
    //前往高三最新资源列表页
    gogszy() {
      // console.log(123);
      // this.$router.push({
      //   name: "Gszy",
      //   query: {
      //     type: this.dingzhiRadio,
      //     kemu_id: this.kemu_id,
      //     nianji_id: this.nianji_id,
      //     kejianbooks_id: this.zyzxMsg.info_2.kejianbooks_id,
      //     path: this.$route.path + "?tapvalue=" + this.tabvalue,
      //     routeName: "首页",
      //   },
      // });
    },
    //前往精选资源页
    goresourceJx() {
      this.$router.push({
        name: "ResourceJx",
      });
    },
    //前往高三专项资源列表
    gogszx(
      kejianbooks_id,
      kejianchapters_id,
      kejianfl_id,
      kejiantag_id,
      kemu_id,
      nianji_id,
      title,
      type_id,
      index,
      list
    ) {
      //将专项数组删除点点击的那个一起传过去
      // list.splice(index,1)
      localStorage.setItem("zxArr", JSON.stringify(list));
      // console.log(list);
      //把当前选中的定制tap分类也带过去，方便判断是否是试卷
      // console.log(JSON.parse(JSON.stringify(arr)))
      this.$router.push({
        name: "Gszx",
        query: {
          kejianbooks_id: kejianbooks_id,
          kejianchapters_id: kejianchapters_id,
          kejianfl_id: kejianfl_id,
          kejiantag_id: kejiantag_id,
          kemu_id: kemu_id,
          nianji_id: nianji_id,
          title: title,
          type: this.dingzhiRadio,
          index: index,
          path: this.$route.path + "?tapvalue=" + this.tabvalue,
          routeName: "首页",
        },
      });
    },
    //前往备战高考
    beizhanUrl(href){
      const url = this.$route.path +'?tapvalue='+this.tabvalue + '&isIndex=1'
      window.open(href + '&path='+ url + '&routeName='+'首页', "_blank");
    },
    //前往校验课内容
    goJiaoyanclass(jyjxk_id) {
      this.$router.push({
        name: "JiaoyanClass",
        query: {
          id: jyjxk_id,
          path: this.$route.path,
          routeName: "首页",
        },
      });
    },
    //点击课件前往课件详情或课件包详情
    goresDetails(id, lx, suffix) {
      // console.log(id, lx);
      //有分类型，并且类型为贝壳资源包
      if (lx && lx == 2 && suffix != "rar" && suffix != "zip") {
        let { href } = this.$router.resolve({
          path: "/resource/beikeziyuan",
          query: {
            id: id,
            path: this.$route.path,
            routeName: "首页",
          },
        });
        window.open(href, "_blank");
        //有分类型，并且类型为课件
      } else if (lx && lx == 1 && suffix != "rar" && suffix != "zip") {
        // console.log("推荐课件")
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
            path: this.$route.path,
            routeName: "首页",
          },
        });
        window.open(href, "_blank");
        //非推荐，全部为正常课件
      } else if (!lx && suffix != "rar" && suffix != "zip") {
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
            path: this.$route.path,
            routeName: "首页",
          },
        });
        window.open(href, "_blank");
      } else if (suffix == "rar" || suffix == "zip") {
        let { href } = this.$router.resolve({
          path: "/resource/zipResDetails",
          query: {
            id: id,
            path: this.$route.path,
            routeName: "首页",
          },
        });
        window.open(href, "_blank");
      }
    },
    //前往推荐的活动
    goActiveDetails(id) {
      this.$router.push({
        name: "ActiveDetails",
        query: {
          id: id,
          from:'index'
        },
      });
    },
    //前往推荐的产品
    goProductDetails(id) {
      this.$router.push({
        name: "ProductDetails",
        query: {
          id: id,
        },
      });
    },
    //前往活动中心
    goActiveCenter() {
      this.$router.push({
        path: "/active",
      });
    },
    //前往资源中心
    goResourceCenter() {
      this.$router.push({
        path: "/product",
      });
    },
    //前往产品中心
    goProductCenter() {
      this.$router.push({
        path: "/product",
      });
    },
    //前往个人中心
    goPersonalCenter() {
      this.$router.push({
        path: "/personal",
      });
    },
    //前往查看数据统计
    goStatistical() {
      this.$router.push({
        path: "/active",
      });
    },
    //首次弹窗
    //切换科目后，版本会更新为选择的科目版本
    changeKemu(id) {
      this.radio1 = id;
      this.radio2 = "";
      //获取教学版本列表
      versionslists({
        kemu_id: this.radio1,
      }).then((res) => {
        // console.log(res, "版本列表");
        const data = res.retRes;
        if (res.retInt == 1) {
          this.banbenList = data;
        }
      });
    },
    //提交设置的科目和版本
    submit() {
      // console.log(this.radio3, this.radio1, this.radio2);
      if (!this.radio1) {
        this.$message({
          message: "请选择学科",
          duration: 1000,
          showClose: false,
        });
      } else if (!this.radio2) {
        this.$message({
          message: "请选择版本",
          duration: 1000,
          showClose: false,
          offset: 300,
        });
      } else if (!this.radio3) {
        this.$message({
          message: "请选择年级",
          duration: 1000,
          showClose: false,
          offset: 300,
        });
      } else {
        setnowkemu({
          md5key: localStorage.getItem("md5key"),
          kemu_id: this.radio1,
          kejianversions_id: this.radio2,
          nianji_id: this.radio3,
          is_now: 1,
        }).then((res) => {
          // console.log(res, "设置科目版本");
          this.$notify.closeAll();
          this.$notify({
            message: "设置科目和版本成功",
            duration: 2000,
            showClose: false,
          });
          this.dialogTableVisible = false;
        });
      }
    },
    //我知道了
    reday() {
      this.$router.push({
        name: "home",
      });
    },
  },
};
</script>
<style>

</style>
<style lang="less" scoped>
#container {
  margin-bottom: 20px;
  min-height: 54vh;
  width: 100%;
  height: 100%;
  background-color: #f0f2f5;

  .top {
    display: flex;
    margin: 0 auto;
    margin-top: 20px;
    width: 1200px;
    // background-color: #e4e4e4;
    .banner {
      margin: 0px auto;
      margin-right: 10px;
      width: 640px;
      .el-carousel {
        width: 640px;
        height: 100%;
        // border-radius: 20px;
        .el-carousel__item {
          width: 100%;
          height: 100%;
          cursor: pointer;
          img {
            width: 100%;
            height: 100%;
            // vertical-align: text-bottom;
            color: #000;
          }
        }
      }
    }
    .picLists {
      margin-right: 10px;
      width: 202px;
      height: 380px;
      img {
        margin-bottom: 10px;
        width: 202px;
        height: 120px;
        vertical-align: text-bottom;
        cursor: pointer;
      }
    }
    .information {
      display: flex;
      width: 338px;
      height: 380px;
      background: #ffffff;
      ul {
        display: flex;
        flex-wrap: wrap;
        li {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          margin-left: 20px;
          margin-top: 23px;
          width: 139px;
          height: 96px;
          background: #faf5f5;
          border-radius: 8px;
          p {
            margin-bottom: 8px;
            color: #333;
          }
          span {
            display: flex;
            align-items: center;
            color: #f05659;
            h2 {
              position: relative;
              top: -6px;
              font-size: 32px;
            }
          }
        }
      }
    }
  }
  // .newziyuan {
  //   margin: 20px auto;
  //   width: 1200px;
  //   // height: 160px;
  //   background: #ffffff;
  //   border-radius: 10px;
  //   overflow: hidden;
  //   .boxtitle {
  //     display: flex;
  //     justify-content: space-between;
  //     align-items: center;
  //     .left {
  //       display: flex;
  //       align-items: center;
  //       margin: 15px;
  //       margin-bottom: 15px;
  //       h4 {
  //         margin-right: 5px;
  //         font-size: 18px;
  //         color: #333;
  //       }
  //       span {
  //         font-weight: 600;
  //         font-size: 14px;
  //         color: #f6444e;
  //       }
  //     }
  //     .right {
  //       margin-right: 15px;
  //       font-size: 12px;
  //       color: #999;
  //       cursor: pointer;
  //     }
  //     .right:hover {
  //       color: #08a579;
  //     }
  //   }
  //   .ziyuancontent {
  //     display: flex;
  //     flex-wrap: wrap;
  //     // justify-content: space-between;
  //     margin-bottom: 15px;
  //     .ziyuanLists {
  //       display: flex;
  //       align-items: center;
  //       // margin-right: 22px;
  //       line-height: 32px;
  //       cursor: pointer;
  //       img {
  //         margin-left: 20px;
  //         margin-right: 5px;
  //         width: 18px;
  //         height: 22px;
  //       }
  //       p {
  //         width: 333px;
  //         color: #333;
  //         font-size: 14px;
  //         overflow: hidden;
  //         text-overflow: ellipsis;
  //         display: -webkit-box;
  //         -webkit-line-clamp: 1; // 控制多行的行数
  //         -webkit-box-orient: vertical;
  //       }
  //     }
  //     .ziyuanLists:hover {
  //       p {
  //         color: #08a579;
  //       }
  //       .zytime {
  //         color: #08a579;
  //       }
  //     }
  //   }
  // }
  .ziyuan {
    display: flex;
    justify-content: space-between;
    margin: 20px auto;
    width: 1200px;
    .newziyuan {
      width: 590px;
      // height: 160px;
      background: #ffffff;
      border-radius: 10px;
      overflow: hidden;
      .boxtitle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left {
          display: flex;
          align-items: center;
          margin: 15px;
          margin-bottom: 15px;
          h4 {
            margin-right: 5px;
            font-size: 18px;
            color: #333;
          }
          span {
            font-weight: 600;
            font-size: 14px;
            color: #f6444e;
          }
        }
        .right {
          margin-right: 15px;
          font-size: 12px;
          color: #999;
          cursor: pointer;
        }
        .right:hover {
          color: #08a579;
        }
      }
      .ziyuancontent {
        display: flex;
        flex-wrap: wrap;
        // justify-content: space-between;
        margin-bottom: 15px;
        .ziyuanLists {
          display: flex;
          align-items: center;
          // margin-right: 22px;
          line-height: 32px;
          cursor: pointer;
          img {
            margin-left: 20px;
            margin-right: 5px;
            width: 18px;
            height: 22px;
          }
          p {
            width: 400px;
            color: #333;
            font-size: 14px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 1; // 控制多行的行数
            -webkit-box-orient: vertical;
          }
          .zytime {
            margin-left: 65px;
            color: #999;
          }
        }
        .ziyuanLists:hover {
          p {
            color: #08a579;
          }
          .zytime {
            color: #08a579;
          }
        }
      }
    }
  }
  .content {
    display: flex;
    margin: 0 auto;
    margin-bottom: 20px;
    width: 1200px;
    .left {
      margin-right: 20px;
      width: 720px;
      // height: 520px;
      background: #ffffff;
      border-radius: 10px;
      overflow: hidden;
      img {
        cursor: pointer;
      }
      .zyTop {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .zytaps {
          display: flex;
          cursor: pointer;
          .zytab {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 20px;
            margin-bottom: 18px;
            p {
              margin-bottom: 5px;
              font-size: 16px;
              color: #333;
            }
            span {
              display: inline-block;
              width: 60px;
              height: 3px;
              // background: #1cbe91;
            }
          }
          .chosetab {
            p {
              color: #1cbe91;
            }
            span {
              background: #1cbe91;
            }
          }
        }
        .seemore {
          // margin-bottom: 20px;
          margin-bottom: 0;
          margin-right: 20px;
          text-align: center;
          font-size: 12px;
          color: #999;
          cursor: pointer;
        }
        .seemore:hover {
          color: #08a579;
        }
      }
      .ziyuanbaoLists {
        display: flex;
        margin-left: 20px;
        margin-bottom: 20px;
        width: 680px;
        height: 120px;
        background: #f5f7fa;
        border-radius: 10px;
        .pic {
          margin: 30px;
          width: 60px;
          img {
            width: 60px;
          }
        }
        .msg {
          position: relative;
          margin-top: 16px;
          cursor: pointer;
          .kejiantitle {
            font-size: 14px;
            color: #333;
            width: 528px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; // 控制多行的行数
            -webkit-box-orient: vertical;
          }
          .ziyuanbaodetails {
            margin-top: 10px;
            span {
              color: #626366;
              font-size: 12px;
              a {
                color: #f6444e;
              }
            }
            .leixing {
              display: inline-block;
              margin: 0 6px;
              width: 40px;
              height: 18px;
              background: #e6edfa;
              border-radius: 2px;
              text-align: center;
              line-height: 18px;
              color: #216efa;
            }
          }
          .bottom {
            position: absolute;
            bottom: 13px;
            // margin-top: 13px;
            color: #939599;
            .upTime {
              margin-right: 29px;
            }
            .seeNum {
              margin-right: 30px;
              i {
                margin-right: 5px;
              }
            }
          }
        }
      }
      .ziyuanbaoLists:last-child {
        margin-bottom: 20px;
      }
      .ziyuanbaoLists:hover {
        .msg {
          .kejiantitle {
            color: #08a579;
          }
        }
      }
      .productLists {
        display: flex;
        align-items: center;
        margin-left: 20px;
        margin-bottom: 20px;
        width: 680px;
        background: #f5f7fa;
        border-radius: 10px;
        cursor: pointer;
        .pic {
          margin: 19px 25px 21px 27px;
          text-align: center;
          width: 80px;
          height: 80px;
          img {
            max-height: 80px;
            object-fit: cover;
          }
        }
        .msg {
          .booktitle {
            margin-bottom: 10px;
            font-size: 14px;
            color: #333;
          }
          // .author {
          //   font-size: 12px;
          //   color: #939599;
          // }
          .author {
            width: 400px;
            font-size: 12px;
            color: #939599;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; // 控制多行的行数
            -webkit-box-orient: vertical;
          }
        }
        .goProduct {
          margin-left: 30px;
          width: 90px;
          height: 30px;
          background-color: #08a579;
          border-radius: 4px;
          color: #fff;
          text-align: center;
          line-height: 30px;
        }
      }
      .productLists:hover {
        .booktitle {
          color: #08a579;
        }
      }
      .shijuanlist {
        display: flex;
        flex-wrap: wrap;
        .sjBox {
          display: flex;
          flex-direction: column;
          align-items: center;
          margin-left: 20px;
          margin-bottom: 10px;
          .pic {
            margin-bottom: 12px;
            img {
              width: 148px;
            }
          }
          p {
            font-size: 14px;
            color: #333;
          }
        }
      }
      .gsYwyilun,
      .gsYwerlun {
        margin-top: 10px;
        img {
          margin: 0px 0 30px 30px;
          width: 192px;
          cursor: pointer;
        }
      }
      .gsEnyilun {
        margin-top: 10px;
        img {
          margin: 0px 0 30px 30px;
          width: 192px;
          cursor: pointer;
        }
      }
      .gsEnerlun {
        .gsenelkejianLists {
          display: flex;
          margin-left: 20px;
          margin-bottom: 20px;
          width: 680px;
          background: #f5f7fa;
          border-radius: 10px;
          cursor: pointer;
          .pic {
            margin: 26px 30px;
            width: 59px;
            height: 67px;
            img {
              width: 59px;
            }
          }
          .msg {
            display: flex;
            flex-direction: column;
            position: relative;
            .boxtitle {
              p {
                margin-top: 26px;
                // margin-bottom: 18px;
                width: 528px;
                font-size: 14px;
                color: #333;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2; // 控制多行的行数
                -webkit-box-orient: vertical;
              }
            }
            .bottom {
              display: flex;
              align-items: center;
              position: absolute;
              bottom: 20px;
              color: #999;
              .upTime {
                margin-right: 20px;
              }
              .seeNum {
                i {
                  margin-right: 5px;
                }
              }
              .rate {
                display: flex;
                margin-right: 38px;
                width: 148px;
              }
              /deep/.el-rate__icon {
                margin-right: 0;
              }
            }
          }
        }
        .gsenelkejianLists:hover {
          .msg {
            p {
              color: #08a579;
            }
          }
        }
      }
      .seemore {
        margin-bottom: 20px;
        text-align: center;
        font-size: 12px;
        color: #999;
        cursor: pointer;
      }
      .seemore:hover {
        color: #08a579;
      }
    }
    .right {
      width: 460px;
      // height: 520px;
      background: #ffffff;
      border-radius: 10px;
      .top {
        display: flex;
        justify-content: space-between;
        margin: 20px;
        width: 420px;
        h3 {
          font-size: 18px;
          color: #333;
        }
        span {
          display: flex;
          align-items: center;
          font-size: 14px;
          cursor: pointer;
          img {
            margin-right: 3px;
            width: 14px;
            height: 14px;
          }
          color: #1cbe91;
        }
      }
      .jindu {
        margin-left: 20px;
        display: flex;
        align-items: center;
        img {
          margin-right: 5px;
          width: 16px;
          height: 14px;
        }
        span {
          font-size: 14px;
          color: #999999;
        }
        p {
          width: 300px;
          font-size: 12px;
          color: #333;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }
      }
      .rili {
        .xingqi {
          margin-top: 18px;
          margin-left: 20px;
          width: 420px;
          height: 48px;
          background: #f5f7fa;
          span {
            display: inline-block;
            width: 60px;
            height: 48px;
            font-size: 14px;
            text-align: center;
            line-height: 48px;
            color: #333;
          }
        }
        .day {
          display: flex;
          flex-wrap: wrap;
          margin-left: 20px;
          .monthdays {
            position: relative;
            display: inline-block;
            width: 60px;
            height: 72px;
            font-size: 14px;
            text-align: center;
            // line-height: 48px;
            font-weight: 600;
            color: #999999;
            p {
              // width: 30px;
              // height: 30px;
              margin-top: 10px;
              font-size: 16px;
            }
            .mulu {
              margin: 0 auto;
              font-size: 12px;
              text-align: center;
              margin-top: 7px;
              width: 34px;
            }
            span {
              position: absolute;
              left: 0;
              bottom: 4px;
              display: inline-block;
              width: 60px;
              height: 28px;
              p {
                position: absolute;
                width: 266px;
                z-index: 10;
                margin: 0;
                font-size: 12px;
                line-height: 28px;
                color: #fff;
              }
              img {
                width: 36px;
                height: 17px;
              }
            }
            .kaishi {
              background-color: #fceded;
            }
            .biao {
              img {
                position: absolute;
                left: 50%;
                bottom: 4px;
                transform: translateX(-50%);
              }
              p {
                img {
                  position: relative;
                  left: 0;
                  bottom: 0;
                  width: 10px;
                  height: 10px;
                  transform: translateX(0);
                }
              }
            }
          }
          .monthdays:first-child {
            margin-left: 0px;
          }
          .kaishiqian {
            background: #ebfaf5;
            color: #333;
            span {
              background-color: #1cbe91;
            }
          }
          .jinxingzhong {
            background-color: #fceded;
            color: #333;
            span {
              background-color: #f05659;
            }
          }
          .yijiesu {
            background: #ebfaf5;
            color: #333;
            span {
              background-color: #1cbe91;
            }
          }
          .isxingqiyi {
            border-top-left-radius: 4px;
            border-bottom-left-radius: 4px;
            span {
              margin-left: 5px;
              width: 56px;
              border-top-left-radius: 4px;
              border-bottom-left-radius: 4px;
            }
          }
          .isxingqiqi {
            border-top-right-radius: 4px;
            border-bottom-right-radius: 4px;
            span {
              width: 56px;
              border-top-right-radius: 4px;
              border-bottom-right-radius: 4px;
            }
          }
          .issingle {
            span {
              width: 56px !important;
            }
          }
        }
      }
    }
  }
  .jyactive {
    margin: 0 auto;
    margin-bottom: 20px;
    width: 1200px;
    background: #ffffff;
    border-radius: 10px;
    .boxtitle {
      display: flex;
      justify-content: space-between;
      align-items: center;
      .left {
        margin: 19px;
        margin-bottom: 15px;
        h4 {
          margin-right: 5px;
          font-size: 18px;
          color: #333;
        }
      }
      .right {
        margin-right: 17px;
        font-size: 12px;
        color: #999;
        cursor: pointer;
      }
      .right:hover {
        color: #08a579;
      }
    }
    .activeList {
      display: flex;
      position: relative;
      padding-bottom: 20px;
      margin-left: 20px;
      .activeBox {
        position: relative;
        margin-right: 40px;
        cursor: pointer;
        .pic {
          img {
            width: 360px;
            max-height: 200px;
            border-radius: 10px;
          }
        }
        .activetitle {
          margin-top: 12px;
          p {
            font-size: 14px;
            color: #333;
            width: 350px;
            line-height: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; // 控制多行的行数
            -webkit-box-orient: vertical;
          }
        }
        .activetime {
          position: absolute;
          bottom: 20px;
          font-size: 12px;
          color: #939599;
        }
        .dosome {
          position: absolute;
          bottom: 16px;
          right: 0;
          text-align: center;
          line-height: 28px;
          font-size: 12px;
          color: #fff;
          width: 80px;
          height: 28px;
          // background: #f05659;
          border-radius: 14px;
          cursor: pointer;
        }
        .bm {
          background: #f05659;
        }
        .zhibo {
          background: #08a579;
        }
        .huifang {
          background: #d5d9de;
        }
      }
      .activeBox:hover {
        // transition: 1s;
        img {
          transition: 0.5s;
          // position: relative;
          // top: -10px;
          transform: translateY(-10px);
          box-shadow: 0px 2px 10px 2px #dedede;
        }
        .activetitle {
          p {
            color: #08a579;
          }
        }
      }
      .seemoreactive {
        position: relative;
        // right: 20px;
        // position: absolute;
        margin-right: 20px;
        width: 360px;
        border-radius: 10px;
        overflow: hidden;
        img {
          width: 360px;
          border-radius: 10px;
        }
        .gomoreactive {
          position: absolute;
          left: 50%;
          bottom: 30px;
          transform: translateX(-50%);
          text-align: center;
          line-height: 40px;
          width: 300px;
          height: 40px;
          background: #08a579;
          border-radius: 6px;
          font-size: 12px;
          color: #fff;
          cursor: pointer;
        }
      }
    }
  }
  .product {
    margin: 0 auto;
    padding-bottom: 20px;
    margin-bottom: 20px;
    width: 1200px;
    background: #ffffff;
    border-radius: 10px;
    .boxtitle {
      display: flex;
      justify-content: space-between;
      align-items: center;
      .left {
        margin: 19px;
        margin-bottom: 15px;
        h4 {
          margin-right: 5px;
          font-size: 18px;
          color: #333;
        }
      }
      .right {
        margin-right: 17px;
        font-size: 12px;
        color: #999;
        cursor: pointer;
      }
      .right:hover {
        color: #08a579;
      }
    }
    .recommend {
      margin-left: 20px;
      .jiaofuBooks {
        display: flex;
        .tips {
          width: 220px;
          height: 260px;
          // background-image: url("../../assets/img/product_jx.png");
          img {
            width: 220px;
            height: 260px;
            object-fit: cover;
          }
          text-align: center;
          overflow: hidden;
        }
        .bookSwiper {
          position: relative;
          width: 960px;
          overflow: hidden;
          .booksList {
            display: flex;
            position: absolute;
            left: 0;
            // width: 24000px;
            // white-space: nowrap;
            .box {
              width: 240px;
              height: 260px;
              text-align: center;
              cursor: pointer;
              img {
                margin-top: 30px;
                // width: 100px;
                height: 133px;
                object-fit: cover;
              }
              h4 {
                margin: 0 auto;
                width: 156px;
                margin-top: 10px;
                font-size: 14px;
                text-align: center;
                font-weight: normal;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2; // 控制多行的行数
                -webkit-box-orient: vertical;
              }
              p {
                margin-top: 15px;
                color: #939599;
                font-size: 12px;
              }
            }
            .box:hover {
              h4 {
                color: #08a579;
              }
            }
          }
          .anniu {
            display: inline-block;
            width: 25px;
            height: 35px;
            background: #000000;
            opacity: 0.3;
            color: #fff;
            font-size: 18px;
            line-height: 33px;
            text-align: center;
            cursor: pointer;
          }
          .leftN {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            border-radius: 0px 18px 18px 0px;
            i {
              margin-right: 2px;
            }
          }
          .rightN {
            position: absolute;
            transform: translateY(-50%);
            top: 50%;
            right: 0;
            border-radius: 18px 0px 0px 18px;
            i {
              margin-left: 2px;
            }
          }
        }
      }
    }
  }
  //首次弹出框的样式
  .chose {
    position: relative;
    margin-left: 40px;
    cursor: pointer;
    p {
      margin: 20px 0;
      margin-bottom: 20px;
      color: #646566;
    }
    .taps {
      display: flex;
      flex-wrap: wrap;
      .classRadio {
        display: flex;
        margin-right: 79px;
        .tips {
          position: relative;
          top: 2px;
          margin-right: 8px;
          width: 14px;
          height: 14px;
          border: 1px solid #cccccc;
          border-radius: 100%;
          line-height: 12px;
          text-align: center;
          span {
            display: inline-block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            width: 9px;
            height: 9px;
            background-color: #fff;
            border-radius: 100%;
          }
        }
        .tips2 {
          border: 1px solid #08a579;

          span {
            background-color: #08a579;
          }
        }
        p {
          margin: 0;
        }
      }
    }
    .tab2 {
      .classRadio {
        margin-bottom: 10px;
      }
    }
    .submitSet {
      position: absolute;
      right: 20px;
      bottom: -80px;
      width: 120px;
      height: 40px;
      background: #08a579;
      color: #fff;
      border-radius: 6px;
      text-align: center;
      line-height: 40px;
      cursor: pointer;
    }
  }
  /deep/.el-dialog--center {
    border-radius: 10px;
    padding-bottom: 80px;
  }
  /deep/.el-dialog__header {
    padding: 0;
  }
  //首页更新提醒弹窗
  .upDateBox {
    position: relative;
    h3 {
      margin-bottom: 30px;
      font-size: 16px;
      text-align: center;
      color: #333;
    }
    p {
      margin: 0 auto;
      font-size: 12px;
      width: 400px;
      line-height: 20px;
      color: #666;
    }
    .pic {
      margin-top: 40px;
      display: flex;
      justify-content: space-around;
      .evm {
        display: flex;
        flex-direction: column;
        align-items: center;
        // justify-content: center;
        width: 120px;
        img {
          margin-bottom: 20px;
          width: 120px;
          height: 120px;
        }
        p {
          text-align: center;
        }
      }
    }
    .liaojie {
      position: absolute;
      right: 20px;
      bottom: -80px;
      width: 120px;
      height: 36px;
      background-color: #08a579;
      text-align: center;
      color: #fff;
      line-height: 36px;
      font-size: 14px;
      border-radius: 10px;
    }
  }
}
</style>
